<div id="page-home" class="page">
	<div class="container">
		<!-- slide start -->
		<style type="text/css">
			.swipe {
				overflow: hidden;
				visibility: hidden;
				position: relative;
			}
			.swipe-wrap {
				overflow: hidden;
				position: relative;
			}
			.swipe-wrap > div {
				float: left;
				width: 100%;
				position: relative;
			}
		</style>
		<div class='swipe'>
			<div class='swipe-wrap'>
				<volist name="goodsLists" id="vo">
					<div>
						<img src="{$vo['images'][0]}" />
					</div>
				</volist>
			</div>
		</div>
		<script src="__PUBLIC__/assets/libs/swipe/swipe.min.js"></script>
		<script type="text/javascript">
			new Swipe(document.querySelector(".swipe"), {
				auto: 3000
			});
		</script>
		<!-- slide end -->

		<!-- user bar start -->
		<include file="user" />
		<!-- user bar end -->
	</div>

	<div class="container padding">
		<!-- mall page start -->
		<div class="equal bg-white text-center" ms-controller="mallPage">
		    <div class="equal-child padding" ms-repeat="mallPageLists">
		        <a ms-attr-href="__CONTROLLER__/page/sid/{$sid}/id/{{el.id}}">
		            <img ms-attr-src="el.icon" class="circle padding" />
		            <h4>{{el.name}}</h4>
		        </a>
		    </div>
		</div>
		<script type="text/javascript">
			avalon.ready(function(){
			    avalon.define({
			        $id: "mallPage",
			        mallPageLists: vars.mallPage
			    })
			})
		</script>
		<!-- mall page end -->

		<!-- product list start -->
		<div class="list list-two margin-top" ms-controller="goodsLists">
		    <div class="list-child margin-bottom padding-sm" ms-repeat="goodsLists">
		        <a ms-attr-href="__CONTROLLER__/show/sid/{$sid}/id/{{el.id}}">
		        <img ms-attr-src="el.image_vertical" />
		        <h5 class="text-ellipsis">{{el.name}}</h5>
		        <h6>&yen;{{el.price}} <del class="small">&yen;{{el.high_price}}</del></h6>
		        </a>
		    </div>
		</div>
		<script type="text/javascript">
			avalon.ready(function(){
			    avalon.define({
			        $id: "goodsLists",
			        goodsLists: vars.goodsLists
			    })
			})
		</script>
		<!-- product list end -->
	</div>
</div>